import React from 'react'

import AreaPicker from '@/components/Area/AreaPicker'

const Component = () =>
{
  //创建表单的对象结构
    const [form] = React.UI.Form.useForm()
    let email = React.business.email ?? '';
    let id = React.business.id ?? 0;

    //初始化的个人资料数据
    let [business, SetBusiness] = useState({
        email: email,
        vercode: '',
    })

    //提交验证码
    //表单提交方法 
    const profile = async (values:any) => {
      console.log(values)
      let email = values.email;
      let code  = values.vercode;
      var result = React.request.post('/business/proEmail',{email,id,code})
      if(result.code == 0){
        React.toast(result.msg,null,'fail');
        return false
      }
       React.toast(result.msg, 'back','success')
       //修改business
       React.business = result.data;
       React.cookie.save('business',result.data,{path: '/'})
      return false
     
    }
    // 获取验证码
    const btu = async () =>{
      var result = React.request.post('/business/email',{email})
      if(result.code == 0){
        React.toast(result.msg,null,'fail');
        return false
      }
      React.toast(result.msg,null,'success');
      return false
    }

  return (
    <>

      {/* 表单结构 */}
      <React.UI.Form
          name="profile"
          layout='horizontal'
          mode='card'
          form={form}
          initialValues={business}
          onFinish={profile}
          footer={<React.UI.Button block type='submit' color='primary' size='large'>提交验证</React.UI.Button>}
      >
          <React.UI.Form.Item name="email" label="邮箱" extra={<div onClick={btu}><a>发送验证码</a></div>}>
              <React.UI.Input placeholder="请输入邮箱" readOnly />
          </React.UI.Form.Item>

          <React.UI.Form.Item name="vercode" label="验证码" rules={[{ required: true }]}>
              <React.UI.Input placeholder="请输入验证码" />
          </React.UI.Form.Item>
      </React.UI.Form>
    </>
  )
}

export default Component